<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>舔狗日记</title>
</head>
<style>
    div {
        width: 60%;
        margin: 3rem auto;
        padding: 1rem 1rem;
        padding-top: 0.1rem;
        border-radius: 5px;
        background-color: rgba(129, 59, 59, 0.5);
        box-shadow: 0.2rem 0.2rem 0.2rem rgba(34, 28, 28, 0.15);
    }

    h2 {
        border-bottom: rgba(34, 28, 28, 0.15) dotted 2px;
        padding-bottom: 0.2rem;
    }

    p {
        font-weight: 300;
        font-size: 1.3rem;
        color: #fff;
    }

    div.next-dog {
        padding: 1rem 1rem;
        margin: 0 auto;
        font-size: 1.5rem;
        font-weight: bolder;
        color: #fff;
        cursor: pointer;
    }
</style>

<body>
    <div>
        <h2>
            舔狗日记
        </h2>
        <p>
            {{ dog_msg }}
        </p>
    </div>
    <div class="next-dog" style="text-align:center" onclick="javascript:location.reload();">
        再来一条
    </div>
</body>

</html>